/* pages/collect/collect.wxss */
.collect {
  background: #f3f4f6;
  height:  100vh;
  // 按钮
  .btn_row {
    display: flex;
    padding: 20rpx;
    .btn_all,
    .btn_hot,
    .btn_line {
      padding: 10rpx;
      border: 2rpx solid #ccc;
      margin-right: 20rpx;
    }
    .active {
      color: var(--themeColor);
      border: 2rpx solid var(--themeColor);
    }
  }
  // 内容
  .collect_content { 
    .collect_content_item {
      padding: 10rpx;
      display: flex;
      background: #fff;
      margin-bottom: 20rpx;
      .collect_img {
        flex: 2;
        display: flex;
        justify-content: center;
        align-items: center;
        image {
          width: 80%;
        }
      }
      .collect_instru {
        flex: 5;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        padding: 0 20rpx;
        .text {
          color: #666;
          // 只显示两行，超出的用省略号代替
          overflow: hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
        }
        .price {
          font-size: 34rpx;
          color: var(--themeColor);
        }
      }
    }
  }
}
